<!DOCTYPE html>
<html>

<head>
    <meta charset="UTF-8">
    <title>时间</title>
    <script src="http://libs.baidu.com/jquery/2.0.0/jquery.min.js"></script>
</head>

<body>

<div class="clock">
    <div class="clock-num" id="clock1">
        200
    </div>
</div>

<div class="clock2">
    <div class="clock-num" id="clock2">
        300
    </div>
</div>

<div class="clock2">
    <div class="clock-num" id="clock3">
        300
    </div>
</div>

<script>

    function formatSeconds(value) {
        var theTime = parseInt(value);// 秒
        var theTime1 = 0;// 分
        var theTime2 = 0;// 小时
        if (theTime > 60) {
            theTime1 = parseInt(theTime / 60);
            theTime = parseInt(theTime % 60);
            if (theTime1 > 60) {
                theTime2 = parseInt(theTime1 / 60);
                theTime1 = parseInt(theTime1 % 60);
            }
        }
        var result = "" + parseInt(theTime) + "秒";
        if (theTime1 > 0) {
            result = "" + parseInt(theTime1) + "分" + result;
        }
        if (theTime2 > 0) {
            result = "" + parseInt(theTime2) + "小时" + result;
        }

        return result;
    }


    var sui_timer = (function () {
        function sui_timer(num, period, showfn) {
            //num 为内部状态 ,period 为周期 1000，event为事件闹钟, outEle为 输出的外部时间 eventcache 为事件缓存处理
            this.num = num;
            this._num = num;

            this.showfn = showfn;
            this.period = period;
            this.fn;

            this.Eventcache = [];

            this.init();
        }

        sui_timer.prototype = {

            constructor: sui_timer,

            start: function () {
                var period = this.period

                this.fn = (function () {

                    return setInterval(function () {

                        this.showfn(this.num--)

                    }.bind(this), period);

                }.bind(this))()

            },

            stop: function () {
                window.clearInterval(this.fn);
                this.reset();
            },

            reset: function (val) {
                if (typeof(val) != "undefined") {
                    this.num = val;
                } else {
                    this.num = 0;
                }
            },

            pause: function () {
                window.clearInterval(this.fn);
            },

            addEvent: function (time, fn) {
                //time 为

                var Eventfn = function (val) {
                    var Ttime = time
                    var Tfn = fn

                    if (Ttime == val) {
                        Tfn();
                    }
                }

                this.Eventcache.push(Eventfn)
                console.log(this.Eventcache);
            },

            init: function () {
                var self = this;

                Object.defineProperty(this, "num", {
                    set: function (val) {
                        this._num = val
                    },

                    get: function () {

                        //循环在时间对象中处理
                        for (var i = 0; i < self.Eventcache.length; i++) {
                            self.Eventcache[i](this._num);
                        }

                        return this._num
                    }
                })
            }
        }
        return sui_timer;
    })()

    var demo = new sui_timer(10, 1000, function (val) {
        $("#clock1").html(formatSeconds(val));
    });

    demo.addEvent(0, function () {
        demo.stop();
        alert("到时了");
        $("#clock1").html("");
    })

    demo.addEvent(4, function () {
        alert("123456")
    })

</script>

</body>

</html>